<template>
	<view class="flex-1 hb column hidden">
		<view class="esay-out2 bgf column">
			<u-tabs @click="handleTabs" :list="tabs" lineWidth="40rpx" keyName="label" lineColor="#0759BB" :scrollable="false" lineHeight="3rpx"
				:activeStyle="{
						color: '#0759BB',
						fontWeight: 'bold',
						fontSize: '28rpx',
						transform: 'scale(1.05)'
					}" :inactiveStyle="{
						color: '#000000',
						fontSize: '28rpx',
						transform: 'scale(1)'
					}" />
		</view>
		<text class="base-price fs24 justify-end mtb20 pr30">请及时关注询价状态</text>
		<view class="flex-1 hb column hidden bgf">
			<scroll-view class="hb" :scroll-y="true" :refresher-enabled="scrollViewTool.isEnabled"
				:refresher-triggered="scrollViewTool.triggered" refresher-background="rgba(0,0,0,0)"
				@refresherrefresh="pullDownRefresh" @refresherrestore="scrollViewTool.triggered = false" :upper-threshold="100"
				:lower-threshold="100" @refresherabort="triggered = false" @scrolltolower="reachBottom">
				<template v-if="listData.length>=0">
					<view class="list_item align-center" v-for="item in listData" :key="item.id"
						@click="navTo('pages/release/price-inquiry/detail',{id:item.id,myType:queryParams.status})">
						<u-image :src="item.images" width="220rpx" height="164rpx" radius="10rpx" />
						<view class="ml24 flex-1 column justify-between" style="height: 164rpx;">
							<view class="column">
								<text class="bold ellipsis lines-2">{{item.name}}</text>
								<text class="mt6 fs24 color6">{{item.on_plate_time}}/{{item.mileage}}万公里</text>
								
							</view>
							<view class="align-center justify-between">
								<view class="align-center color6 fs24">
									<u-icon name="map" />
									<text class="ml10">{{item.province_name}} {{item.on_plate_time}}</text>
								</view>
								<view class="column centerV">
									<text class="base-price fs30 bold">{{item.total_money}}万</text>
									<text class="color6 fs24 mt3">最高出价</text>
								</view>
							</view>
						</view>
					</view>
					<u-loadmore :status="loadStatus" />
				</template>
				<view class="flex-1 hb centerV" v-else>
					<fr-empty-data />
				</view>
			</scroll-view>
		</view>
	</view>
</template>

<script setup>
	import {
		ref
	} from 'vue';
	import {
		savePhotos,
		navTo
	} from '@/core/app';
	import {
		useLoadPageList
	} from "@/hooks/useLoadPageList/useLoadPageList.js";
	import {
		getMyInquiry
	} from "@/api/priceInquiry";
	import {
		getMyCarSourceCount
	} from "@/api/user/carSource";
	import {
		onLoad
	} from "@dcloudio/uni-app";
	import {
		useCarHook
	} from '../hooks/index';
	const {
		tabs,
		getMyCarSourceCountApi,handleCheckState
	} = useCarHook(5)
	const queryParams = ref({
		status: 1,
	});
	const {
		getListData,
		listData,
		listDataDelay,
		loadStatus,
		scrollViewTool,
		reachBottom,
		pullDownRefresh,
		reSetList,
	} = useLoadPageList(getMyInquiry, queryParams.value);


	onLoad(() => {
		getMyCarSourceCountApi(5,tabs.value)
		getListData()
		
	})
	//切换分类
	const handleTabs = (item) => {
		console.log(item,11111)
		queryParams.value.status = item.value
		reSetList()
	}

</script>

<style scoped lang="scss">
	.input-ctn {
		width: 100%;
		height: 73rpx;
		border-radius: 20rpx 20rpx 20rpx 20rpx;
		border: 2rpx solid #0759bb;
		display: flex;
		justify-content: flex-start;
		align-items: center;
		padding: 0 16rpx;
		box-sizing: border-box;

		.input-css {
			font-weight: 400;
			font-size: 26rpx;
		}

		.holder {
			font-weight: 400;
			font-size: 26rpx;
			color: #bdbcba;
		}
	}

	.list_item {
		padding: 31rpx 20rpx;
		border-bottom: 1rpx solid #EDEDED;
	}
</style>